<template>
  <div class="p-4">
    <h2 class="text-xl font-bold mb-4">Mock 数据测试</h2>

    <div class="space-y-4">
      <div class="flex gap-4">
        <el-button type="primary" @click="testNormalReport(1)">
          测试正常报告解读 (ID: 123456)
        </el-button>

        <el-button type="primary" @click="testNormalReport(2)">
          测试正常完整报告 (ID: 123456)
        </el-button>
      </div>

      <div class="flex gap-4">
        <el-button type="warning" @click="testPendingReport(1)">
          测试待分析报告解读 (ID: 123457)
        </el-button>

        <el-button type="warning" @click="testPendingReport(2)">
          测试待分析完整报告 (ID: 123457)
        </el-button>
      </div>

      <div class="flex gap-4">
        <el-button type="danger" @click="testRejectedReport(1)">
          测试已驳回报告解读 (ID: 123458)
        </el-button>

        <el-button type="danger" @click="testRejectedReport(2)">
          测试已驳回完整报告 (ID: 123458)
        </el-button>
      </div>
    </div>

    <div v-if="loading" class="mt-4">
      <el-loading-directive />
      加载中...
    </div>

    <div v-if="result" class="mt-4">
      <h3 class="text-lg font-semibold mb-2">测试结果：</h3>
      <pre class="bg-gray-100 p-4 rounded text-sm overflow-auto max-h-96">{{
        JSON.stringify(result, null, 2)
      }}</pre>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import { reportApi } from "@/api/report-api";
import { ElMessage } from "element-plus";

const loading = ref(false);
const result = ref(null);

const testReport = async (reportId: string, reportType: number = 1) => {
  loading.value = true;
  result.value = null;

  try {
    const response = await reportApi.queryReportDetail({
      reportId,
      reportType
    });

    result.value = response;

    if (response.code === 0) {
      ElMessage.success("获取数据成功");
    } else {
      ElMessage.error("获取数据失败");
    }
  } catch (error) {
    console.error("测试失败:", error);
    ElMessage.error("请求失败");
    result.value = { error: error.message };
  } finally {
    loading.value = false;
  }
};

const testNormalReport = (reportType: number) =>
  testReport("123456", reportType);
const testPendingReport = (reportType: number) =>
  testReport("123457", reportType);
const testRejectedReport = (reportType: number) =>
  testReport("123458", reportType);
</script>
